/*
 * @Autor: dc
 * @Date: 2022-04-01 11:09:27
 * @LastEditors: Please set LastEditors
 * @LastEditTime: 2022-10-18 16:12:59
 * @Description: 浇水
 */
import React, { Component } from 'react'
import store from '../../../../redux/store'
import $ from 'jquery'
import './index.scss'

import { Toast } from 'antd-mobile'
import { actionBarConfig } from '../../../../redux/action/tree'


export default class index extends Component {

    wateringFun() {
        console.log('浇水')
        const { treeAnimation, addEnergy } = this.props
        const { operationArr } = store.getState()
        const { prepare, cooling } = operationArr.find(item => item.name === '浇水')
        if (prepare > 0) {
            Toast.show({
                content: '请耐心等待,浇水充能中',
                maskClickable: false,
            })
            return;
        }
        $('.water').animate({
            "right": "25%",
            "opacity": '1',
            'bottom': '10%',
        }, 2000, function () {
            $('.water').addClass('watering');
            store.dispatch(actionBarConfig({
                name: '浇水',
                prepare: cooling,
            }, 1000))
            setTimeout(() => {
                $('.water').removeClass('watering');
                $('.water').animate({
                    "opacity": '0'
                }, 500)
                setTimeout(() => {
                    $('.water').css({ "bottom": "30%", 'right': 0 });
                  
                    treeAnimation();
                    addEnergy();
                }, 1500)
            }, 4000)
        })
    }

    render() {
        return (
            <div className="water">
                <i className="water_img">
                    <img
                        src={require('../../../../assets/operation/water.png')}
                        alt="" />
                    <img className="shuidi"
                        src={require('../../../../assets/operation/shuidi.png')}

                        alt="" />
                </i>
            </div>
        )
    }
}
